$(function (){
    //todo write my js code at here
    loadTeacherList();
});


function loadTeacherList(){
    $.ajax({
        url:"/api/teacher/list"
    }).done(function (data){
        //查找全部的数据的按钮点击事件
        let html="";
        data.forEach((element,index)=>{
            html += "<tr>"
            html+="<td>"+element.id+"</td>"
            html+="<td>"+element.tno+"</td>"
            html+="<td>"+element.name+"</td>"
            html+="<td>"+element.sex+"</td>"
            html+="<td><a href='#' onclick='showTeacherDlg("+element.id+")'>" +
                "编辑</a>&nbsp;&nbsp;<a href='#' onclick='deleteById("+element.id+")'>删除</a></td>"
            html+="</tr>"
        })
        $("#studentTb").html(html)
    })
}
/**
 * 弹出教师新增/更新对话框
 */

let layerIndex;
function showTeacherDlg(id){
    let title="新增教师"
    if(id){
        //是编辑
        $("#formId").css("display","block");
        title="编辑学生"
        //读取学生信息并赋值
        $.ajax({
            url:"/api/teacher/"+id,
            method: "GET"
        }).done(result=>{
            console.log(result)
            //遍历result对象并将值填充到#teacherForm表单中
            $.each(result,function (key,value){
                //修改选择器，确保选择的是#teacherForm内的字段
                var field=$('#teacherForm [name="'+key+'"]');
                if(field.is(':radio')){
                    field.filter('[value="'+value+'"]').prop('checked',true);//选中对应的单选按钮
                }else if(field.is(':checkbox')){
                    field.prop('checked',value==="yes");//选中复选框
                }else{
                    field.val(value);//填充文本框或其他字段
                }
            });
        })
    }else{
        //是新增
        $("#teacherForm")[0].reset();
        $("#formId").css("display","none");

    }

    layerIndex=layer.open({
        type: 1,
        title:title,
        area:['480px','auto'],
        content:$('#teacherForm'),//捕获层
    });
}

layui.use(function (){
    //(1)验证表单是否合法
    layui.form.on('submit(teacher-dlg)',function (data){
        event.preventDefault();//阻止表单默认提交
        commitTeaDlg();
    })
});
function commitTeaDlg() {
    let id = $("#id").val();
    let formData = $("#teacherForm").serialize();

    // 禁用按钮
    $("#btnOK").prop("disabled", true).addClass("layui-btn-disabled");

    if (id != null && id != "") {
        // 是更新教师
        url = "/api/teacher/update";
        method = "PUT";
    } else {
        // 新增教师
        url = "/api/teacher/add";
        method = "POST";
        //当新增时，将id去掉
        formData = formData.replace(/id=([^&]*)/i, '');
        // 在新增时，确保 id 输入框不被禁用
    }

    $.ajax({
        url: url,
        method: method,
        data: formData
    }).done(result => {
        console.log(result);
        if (result.id !== undefined) { // 确保 result.id 存在
            // （3）读取并刷新原来的教师列表
            loadTeacherList();
            // （4）关闭弹出层
            console.log("操作成功!");
            if (layerIndex) {
                layer.close(layerIndex);
            }
        }
    }).fail((jqXHR, textStatus, errorThrown) => {
        console.error("Request failed: " + textStatus + " - " + errorThrown);
        // 可以在这里处理错误逻辑
        alert("An error occurred. Please try again.");
    }).always(() => {
        // 无论成功还是失败，都重新启用按钮
        $("#btnOK").prop("disabled", false).removeClass("layui-btn-disabled");
    });
}
    /*function commitTeaDlg(){
        let id=$("#id").val()
        let formData=$("#teacherForm").serialize();
        if(id!=null&&id!=""){
            //是更新学生
            $("#id").removeAttribute('')
            $("#id").setAttribute('disabled');
            $.ajax({
                url:"/api/teacher/update",
                method:"PUT",
                data:formData
            }).done(result=>{
                console.log(result);
                if(result.id){
                    //（3）读取并刷新原来的读教师列表
                    loadTeacherList();
                    //（4）关闭弹出层
                    console.log("add success!")
                    if(layerIndex){
                        layer.close(layerIndex);
                    }
                }
            }).fail((jqXHR,textStatus,errorThrown)=>{
                console.error("Request failed:"+textStatus+" - "+errorThrown);
                //可以在这里处理错误逻辑
                alert("An error occurred.Please try again.");
            });
        }else{
            //新增学生
            //新增学生需要进行
            //(2)将表单数据发送到服务器的insert中，把按钮变灰

            $.ajax({
                url:"/api/teacher/add",
                method:"POST",
                data:formData
            }).done(result=>{
                console.log(result);
                if(result.id){
                    //（3）读取并刷新原来的读教师列表
                    loadTeacherList();
                    //（4）关闭弹出层
                    console.log("add success!")
                    if(layerIndex){
                        layer.close(layerIndex);
                    }

                }
            }).fail((jqXHR,textStatus,errorThrown)=>{
                console.error("Request failed:"+textStatus+" - "+errorThrown);
                //可以在这里处理错误逻辑
                alert("An error occurred.Please try again.");
            });
        }
        $("#btnOK").prop("disabled",true).addClass("layui-btn-disabled");//禁用按钮
*/
/*}*/
function deleteById(id){
    //删除
    layer.confirm('你真的要删除吗？一旦删除不可恢复', {icon: 3}, function(){
        $.ajax({
            url:"/api/teacher/delete/"+id,
            method:"DELETE"
        }).done(result=>{
            loadTeacherList();
        })
        layer.closeAll();
    }, function(){
    });
}